﻿<!DOCTYPE html>
<html>
<!-- 培训计划管理 -->

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta Trainer="viewport" content="width=device-width, initial-scale=1">
    <script src="/static/js/common.js"></script>

</head>

<body>

    <div id="app" v-cloak>
        <el-form label-position="right" ref="form" :inline="true" :model="formInline" class="demo-form-inline"
                 style="margin-bottom: 15px;">
            <el-row>
                <el-col class="head-tool">
                    <el-button type="primary" @click="onSubmit">{{col.btnSelect}}</el-button>
                    <el-button type="primary" @click="onSubmitForm">{{col.Choose}}</el-button>
                </el-col>
            </el-row>
            <el-row>
                <el-col :xs="12" :sm="8" :md="6" :lg="6" :xl="6">
                    <div class="elst-select-mini">
                        <el-form-item>
                            <el-input size="mini">
                                <template slot="prepend">
                                    {{RisksManagement.RiskContent.Unit+mark.m}}
                                </template>
                                <treeselect v-model="formInline.model.Unit"
                                            :options="department"
                                            :flat="true"
                                            :show-count="true"
                                            slot="suffix"
                                            style="line-height: 28px;"
                                            placeholder="请选择" />
                            </el-input>
                        </el-form-item>
                    </div>
                </el-col>
                <el-col :xs="12" :sm="8" :md="6" :lg="6" :xl="6">
                    <div class="elst-select-mini">
                        <el-form-item>
                            <el-input v-model="formInline.model.Objective"
                                      :placeholder="RisksManagement.RiskContent.Objective" size="mini">
                                <template slot="prepend">
                                    {{RisksManagement.RiskContent.Objective+mark.m}}
                                </template>
                            </el-input>
                        </el-form-item>
                    </div>
                </el-col>
                <el-col :xs="12" :sm="8" :md="6" :lg="6" :xl="6">
                    <div class="elst-select-mini">
                        <el-form-item>
                            <el-input v-model="formInline.model.Content"
                                      :placeholder="RisksManagement.RiskContent.Content" size="mini">
                                <template slot="prepend">
                                    {{RisksManagement.RiskContent.Content+mark.m}}
                                </template>
                            </el-input>
                        </el-form-item>
                    </div>
                </el-col>
            </el-row>
        </el-form>
        <el-table ref="table" :data="ListItem.tableData" :row-key="getRowKeys" border
                  @selection-change="handleSelectionChange" row-style="height:10px" style="width: 100%;">
            <el-table-column type="selection" style="
    padding-top: 0px;
    padding-bottom: 0px;
" align="center" width="50" :reserve-selection="true">
            </el-table-column>
            <el-table-column type="index" :label="RisksManagement.RiskContent.id" :index="indexMethod" width="50"
                             show-overflow-tooltip="true"></el-table-column>
            <el-table-column prop="sysDepartment.name" :label="RisksManagement.RiskContent.Unit" min-width="80" show-overflow-tooltip="true">
            </el-table-column>
            <el-table-column prop="objective" :label="RisksManagement.RiskContent.Objective" min-width="120" show-overflow-tooltip="true" align="center">
            </el-table-column>
            <el-table-column prop="personInChargeText" :label="RisksManagement.RiskContent.PersonInCharge" min-width="80" show-overflow-tooltip="true" align="center">
            </el-table-column>
            <el-table-column prop="participant" :label="RisksManagement.RiskContent.Participant" min-width="120" show-overflow-tooltip="true" align="center">
            </el-table-column>
            <el-table-column prop="requirements" :label="RisksManagement.RiskContent.Requirements" min-width="120" show-overflow-tooltip="true" align="center">
            </el-table-column>
            <el-table-column prop="content" :label="RisksManagement.RiskContent.Content" min-width="120" show-overflow-tooltip="true" align="center">
            </el-table-column>


        </el-table>
        <el-row type="flex" justify="end">
            <el-pagination ref="page" @size-change="handleSizeChange" @current-change="handleCurrentChange"
                           :current-page="ListItem.currentPage" :page-sizes="ListItem.pagesizes" :page-size="ListItem.pagesize"
                           :layout="ListItem.layout" :total="ListItem.total">
            </el-pagination>
        </el-row>
        <br>
        <el-button class="fr" type="primary" @click="parent.ListItem.dialogVisible=false">{{col.btnBack}}</el-button>
    </div>
    <script type="text/javascript">
        Vue.component('treeselect', VueTreeselect.Treeselect)

        var app = new Vue({
            el: '#app',
            data: {
                //表单内容
                ListItem: ListItem,
                //获取下拉菜单situation
                situation: [],
                department: [],
                formInline: {
                    model: {
                        CreateFactory: null,
                        Unit: null,
                        Objective: '',
                        PersonInCharge: null,
                        ParticipantID: null,
                        Content: ''
                    },
                    offset: 0,
                    limit: 10
                }
            },
            mounted: function () {
                //获取下拉菜单内容
                this.getDepartmentData();
                //初始化数据
                this.GetPageData(1);
                //列表高度自适应
                tablehigh(this);
            },
            methods: {
                //解決edge下select bug
                visibleChange: function (isVisible) {
                    visibleChange(isVisible)
                },
                //表格序号连续化
                indexMethod: function (index) { return (this.ListItem.currentPage - 1) * this.ListItem.pagesize + index + 1; },
                //关闭Dialog 回调
                closeDialog: function () { closeDialog(this); },
                //列表选择触发
                handleSelectionChange: function (val) { handleSelectionChange(this, val); },
                //Dialog展示
                //获取分页数据
                GetPageData: function (currentIndex) { GetPageData(this, currentIndex, '/api/YH_Screening/GetPlanList') },
                //查询方法
                onSubmit: function () { onSubmit(this); },
                //pagesize改变 触发方法
                handleSizeChange: function (val) { handleSizeChange(this, val); },
                //跳页触发方法
                handleCurrentChange: function (val) { handleCurrentChange(this, val); },
                //获取下拉菜单数据
                getDropDown: function () {
                },
                //初始化部门下拉树
                getDepartmentData: function () {
                    var mythis = this;
                    myAjax("post", this, '/api/SysDepartment/GetList', { model: { Name: '', Code: '', CreateFactory: mythis.formInline.model.CreateFactory }, offset: 0, limit: 999 }, function (response) {
                        mythis.department = menuHelperX(response.data.pageData, guidEmpty)
                    }, false);
                },
                onSubmitForm: function () {
                    var mythis = this;
                    if (mythis.ListItem.tableMultipleSelection.length != 1) {
                        showMessage(msg.OnlyOne, 'error')
                        return;
                    }
                    var obj = this.ListItem.tableMultipleSelection[0];
                    console.log(obj)

                    var parentForm = parent.app.Form;
                    console.log(parentForm);

                    ////parentForm.screeningPlanId = obj.id;
                    ////parentForm.investigationPost = obj.investigationPost;
                    ////parentForm.investigationPostName = obj.investigationPostName;
                    ////parentForm.standardType = obj.standardType;
                    ////parentForm.standardTypeText = obj.standardTypeText;

                    //parentForm.unit = obj.unit;
                    //parentForm.unitName = obj.sysDepartment.name;
                    //parentForm.objective = obj.objective;
                    //parentForm.personInCharge = obj.personInCharge;
                    //parentForm.personInChargeText = obj.personInChargeText;
                    //parentForm.participant = obj.participant;
                    //parentForm.requirements = obj.requirements;
                    //parentForm.content = obj.content;

                    //parentForm.yH_ProjectAndDetail = obj.yH_ProjectAndDetail;


                    ////parentForm.yH_ScreeningPlanProject = obj.yH_ScreeningPlanProject;

                    //onSubmitForm(this, '/api/YH_Screening/Save', obj);
                    var url = '/api/YH_Screening/Save';
                    var Form = obj;
                    var mythis = this;
                    var loadingObj;
                    if (mythis._isVue)
                        loadingObj = mythis.$loading(myloading);
                    else
                        loadingObj = mythis.app.$loading(myloading);
                    mythis.ListItem.loadingbut = true;

                    myAjax("post", mythis, url, Form, function (response) {
                        parent.app.id = response.data;
                        showMessage(msg.OperatingOk, 'success');
                        parent.app.ListItem.dialogVisible = false;
                        mythis.ListItem.loadingbut = false;
                        loadingObj.close();
                    }, false, function (response) {
                        showMessage(response.message, 'error')
                        loadingObj.close();

                    });
                    //parent.app.ListItem.dialogVisible = false;
                }
            }
        });
        //下拉树数据格式化
        function menuHelperX(list, pid) {
            var result = [];
            if (list.length <= 0)
                return list;
            list.forEach(function (v, i) {
                var temp = {};
                for (var key in v) {
                    temp[key] = v[key];
                }
                temp.label = v.name;
                temp.parentId = temp.parentId ? temp.parentId : guidEmpty;
                var obj;
                if (temp.parentId == pid) {
                    obj = temp;
                    var nextObj = menuHelperX(list, temp.id);
                    if (nextObj.length > 0) {
                        obj.children = nextObj;
                    }
                }
                if (obj)
                    result.push(obj)
            })
            return result;
        }
    </script>
</body>

</html>